<template>
  <div class="im-iq-topInput" style="margin-top:5px">
    <div>
      <el-button size="mini" type="primary" @click="handleQuery"
        >查询</el-button
      >
      <el-button size="mini" type="primary" @click="excelExport"
        >导出</el-button
      >
    </div>
    <div class="im-iq-topInputList">
      <ul>
        <li>
        <el-input
          size="mini"
          v-model="barcode" 
          placeholder="请输入内容"
        ></el-input>
        <span>条码：</span>
      </li>
      <li>
        <el-input
          size="mini"
          v-model="productCode"
          placeholder="请输入内容"
        ></el-input>
        <span>机型：</span>
      </li>
      <li>
        <el-input
          size="mini"
          v-model="batchNo"
          placeholder="请输入内容"
        ></el-input>
        <span>批次：</span>
      </li>
      <li>
        <el-input size="mini" v-model="aoCode" placeholder="请输入内容" ></el-input>
        <span>AO号：</span>
      </li>
      <li>
        <el-input
          size="mini"
          v-model="itemCode"
          placeholder="请输入内容"
        ></el-input>
        <span>图号：</span>
      </li>
      <li>
        <el-input
          size="mini"
          v-model="mProductNumber"
          placeholder="请输入内容"
        ></el-input>
        <span>型号：</span>
      </li>
      <li>
        <el-input
          size="mini"
          v-model="mParentNumber"
          placeholder="请输入内容"
        ></el-input>
        <span>父件型号：</span>
      </li> 
      <li>
        <el-input
          size="mini"
          v-model="qualityCode"
          placeholder="请输入内容"
        ></el-input>
        <span>质量编号：</span>
      </li>
      <li>
        <el-input
          size="mini"
          v-model="inEmpCode"
          placeholder="请输入内容"
        ></el-input>
        <span>入库人：</span>
      </li>
      <li>
        <el-input
          size="mini"
          v-model="deliveryShop"
          placeholder="请输入内容"
           
        ></el-input>
        <span>移交单位：</span>
      </li>
      <li>
        <el-input
          size="mini"
          v-model="requireShop"
          placeholder="请输入内容"
           
        ></el-input>
        <span>需求单位：</span>
      </li>
      <li>
        <el-input
          size="mini"
          v-model="wmsItemInventoryId" 
          placeholder="请输入内容"
        ></el-input>
        <span>台账ID：</span>
      </li>
      <li>
        <el-input
          size="mini"
          v-model="wmsDeliveryPlanId" 
          placeholder="请输入内容"
        ></el-input>
        <span>交接单ID：</span>
      </li>
      <li>
        <el-date-picker
            size="mini"
            v-model="startDate"
            type="date"
            placeholder="选择日期"
            value-format="yyyy-MM-dd"
          ></el-date-picker>
        <span>入库起始时间：</span>
      </li>
      <li>
        <el-date-picker
            size="mini"
            v-model="endDate"
            type="date"
            placeholder="选择日期"
            value-format="yyyy-MM-dd"
          ></el-date-picker>
        <span>入库结束时间：</span>
      </li>   
      <li>
          <el-select size="mini" v-model="restCount" placeholder="请选择">
                    <el-option
                        v-for="item in options1"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    >
                    </el-option>
                </el-select>
              <span>库存数量：</span>
       </li>
    </ul>
    </div>
  </div>
</template>
<script>
import { accountQuerySearch } from "@/utils/api.js";
import request from "@/utils/request.js";
import axios from "axios";
export default {
  name: "ImIqTopInput",
  data() {
    return {
      options1: [
        {
          value: 0,
          label: "无库存",
        },
        {
          value: 1,
          label: "有库存",
        }
      ],
      productCode:'',
      restCount:1,
      batchNo:'',
      itemCode:'',
      startDate:'',
      endDate:'',
      qualityCode:'',
      mProductNumber:'',
      mParentNumber:'',
      aoCode:'',
      inEmpCode:'',
      deliveryShop:'',
      requireShop:'',
      barcode:'',
      wmsItemInventoryId:'',
      wmsDeliveryPlanId:'',
      pageSize:20,
      pageNumber:1,
    };
  },
  methods:{
    handleQuery(){
      var searchParam =  {
          productCode: this.productCode,
          batchNo: this.batchNo,
          restCount:this.restCount,
          itemCode: this.itemCode,
          qualityCode:this.qualityCode,
          mProductNumber:this.mProductNumber,
          mParentNumber:this.mParentNumber,
          inEmpCode:this.inEmpCode,
          deliveryShop:this.deliveryShop,
          requireShop:this.requireShop,
          barcode:this.barcode,
          wmsItemInventoryId:this.wmsItemInventoryId,
          wmsDeliveryPlanId:this.wmsDeliveryPlanId,
          aoCode:this.aoCode, 
          startDate:this.startDate,
          endDate:this.endDate
        }
      this.$bus.$emit("queryBtnClick",searchParam);
    },
    excelExport(){
      var searchParam =  {
          productCode: this.productCode,
          batchNo: this.batchNo,
          restCount:this.restCount,
          itemCode: this.itemCode,
          qualityCode:this.qualityCode,
          mProductNumber:this.mProductNumber,
          mParentNumber:this.mParentNumber,
          inEmpCode:this.inEmpCode,
          deliveryShop:this.deliveryShop,
          requireShop:this.requireShop,
          barcode:this.barcode,
          wmsItemInventoryId:this.wmsItemInventoryId,
          wmsDeliveryPlanId:this.wmsDeliveryPlanId,
          aoCode:this.aoCode, 
          startDate:this.startDate,
          endDate:this.endDate
        };
        console.log("searchParam1",searchParam);
      request.post("/exceltest/excel",searchParam,{responseType:'blob'}).then((res) => {
        const aLink = document.createElement('a')
        var blob = new Blob([res.data], {type:"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"})
        // //从response的headers中获取filename, 后端response.setHeader("Content-disposition", "attachment; filename=xxxx.docx") 设置的文件名;
        var patt = new RegExp('filename=([^;]+\\.[^\\.;]+);*')
        var contentDisposition = decodeURI(res.headers['content-disposition'])
        var result = patt.exec(contentDisposition)
        var fileName = result[1]
        fileName=fileName = fileName.replace(/\"/g, '')
        aLink.href = URL.createObjectURL(blob)
        aLink.setAttribute('download', fileName) // 设置下载文件名称
        document.body.appendChild(aLink)
        aLink.click()
        document.body.appendChild(aLink)
      })
    }
       
  },
  mounted(){
    
  }
}

</script>
<style scoped>
.el-select {
  width: 140px;
}
.el-input {
  width: 180px;
}
.im-iq-topInput {
  overflow: hidden;
}
.im-iq-topInputList {
  text-align: center;
}
.im-iq-topInput ul li {
  float: left;
  width: 20%;
  height: 30px;
  line-height: 30px;
  margin-right: 1%;
  margin-bottom: 5px;
}
.im-iq-topInput ul li span {
  float: right;
}
.im-iq-topInput ul li div {
  float: right;
}
</style>